<!doctype html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" th:replace="layout (title='关于我们')">
<div th:fragment="content">
    <div class="m2ban wOpacity wow fadeIn" data-wow-delay="0.0s"
         th:style="${'background-image:url('+bannerInfo.imgSrc+')'}">
        <div class="m2banTxt">
            <div class="m2ban_t1 wOpacity wow fadeInUp" data-wow-delay="0.2s"
                 th:utext="${bannerInfo.title + '<br />' + bannerInfo.realTitle}"></div>
        </div>
    </div>
    <div class="container wOpacity wow fadeIn" data-wow-delay="0.0s">
        <div class="m2usCon1">
            <div class="m2us_t wOpacity wow fadeIn" data-wow-delay="0.2s" th:text="${articleInfo.title}"></div>
            <div class="m2usEditor wOpacity wow fadeIn" data-wow-delay="0.3s" th:utext="${articleInfo.content}">
            </div>
        </div>
    </div>
    <div class="m2usCon2 wOpacity wow fadeIn" data-wow-delay="0.0s">
        <div class="container">
            <div class="m2us_t wOpacity wow fadeIn" data-wow-delay="0.2s">发展历程</div>
            <div class="m2usSwiper wOpacity wow fadeIn" data-wow-delay="0.3s">
                <a href="#" class="nLink prev"></a>
                <a href="#" class="nLink next"></a>
                <div class="swiper-container">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide" th:each="his : ${history}">
                            <div class="m2usBox">
                                <div class="m2usBx1">
                                    <i></i>
                                    <div class="m2us_year" th:text="${his.title}"></div>
                                    <div class="m2us_des1" th:utext="${his.realTitle}"></div>
                                </div>
                                <div class="m2usBx2">
                                    <i></i>
                                    <div class="m2us_des2">
                                        <strong th:text="${his.title}"></strong>
                                        <p th:utext="${his.content}"></p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script language="javascript">
        var swiper = new Swiper('.swiper-container', {
            pagination: '.swiper-pagination',
            nextButton: '.m2usSwiper .next',
            prevButton: '.m2usSwiper .prev',
            slidesPerView: 6,
            paginationClickable: true,
            spaceBetween: 0,
            breakpoints: {
                767: {
                    slidesPerView: 1,
                },
                993: {
                    slidesPerView: 3,
                },
                1199: {
                    slidesPerView: 4,
                }
            }
        });
    </script>
    <script language="javascript">
        $(function () {
            $("#aboutLi").addClass("hover");
        })
    </script>
</div>
</html>